<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title class="passwd"></title>
	<link rel="stylesheet" type="text/css" href="index.css">
	<link rel="stylesheet" href="xterm.css" />
	<script src="xterm.js"></script>

</head>

<body style="overflow: hidden;">
	<div>
		<h2>请输入系统密码</h2>
		<form id="password-form">
			<label for="password">密码：</label>
			<input type="password" id="password" name="password" required>
			<button type="submit">确定</button>
		</form>
	</div>
	<div id="terminal" style="overflow: auto;"></div>

	<script>

		function setDarkTheme(streamArgs) {
			if (streamArgs.theme && streamArgs.theme.indexOf('Dark') !== -1) {
				document.body.classList.add('dark');
			} else {
				document.body.classList.remove('dark');
			}
		}

		const { ipcRenderer } = require('electron');
		ipcRenderer.on('init-data1', (event, arg) => {
			// 在这里执行相应操作
			setDarkTheme(arg);
		});

		const passwordForm = document.getElementById('password-form');

		passwordForm.addEventListener('submit', (event) => {
			event.preventDefault();
			const passwordInput = document.getElementById('password');
			const password = passwordInput.value;

			const installMsg = {
				type: "startInstall",
				installPasswd: password,
			}
			// 将密码发送回主进程
			ipcRenderer.send('kylinide.installWizard.msg.process', installMsg);

			// // 关闭密码对话框
			// window.close();
		});

		var term = new Terminal();
		term.open(document.getElementById('terminal'));
		// term.resize(80,24);
		// term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
		term.writeln("欢迎使用 xterm!");

		term.onData((data) => {
			const xtermData = {
				type: "xtermData",
				data: data
			}
			ipcRenderer.send('kylinide.installWizard.msg.process', xtermData);
		});
		ipcRenderer.on('kylinide.installWizard.msg.process', (event, message) => {
			if(message.type == "xtermInput"){
				term.writeln(message.data);
			}
		});
	</script>

</body>

</html>
